//mixins混入
//定义接口类型数据[如列表，详情，搜索，联想词]
const App_Payer_api_data = [
	{
		apivod:'/api.php/provide/vod/',
		ac_list: 'list',//列表
		ac_detail: 'detail',//详情
		ac_videolist: 'videolist',//视频列表模式
		//search_videolist: 'videolist&wd=',//搜索视频列表
		search_suggest: '/index.php/ajax/suggest?mid=1&code=1&wd=',//联想词搜索
	}
]

export default {
	data() {
		return {
			AppPlayerApi:App_Payer_api_data[0],
			xtsetting:[],
			curIndex: 0,//当前坐标
			//影视分类>>一级分类
			tabslist: [
				{
					"name":"获取中"
				}
			],
			// 插入分类对应的videolist数据数组
			tabslistVideolist:[
				// 由于组件更快，这里控制台会报错，但不影响
				// TypeError:无法读取未定义的属性“videolist”
				{
					"videolist":[]
				}
				// 测试数据，请求时自动根据分类高度插入对应的对象数组
				// {
				// 	"videolist":[]
				// }
			],
			Videolist_pg:[
				// 第一个pg为推荐的页码，此版本已废弃
				{
					pg:1//推荐分类 当前页[上拉加载更多调用]
				},
				// 测试数据，请求时自动根据分类高度插入对应的对象数组
				// {
				// 	"pg":0
				// }
			],
			Videolist_onReady:[
				/* ========================================
				 * =  测试数据，左右滑动时判断是否为首次加载，
				 * =  如果不是左右滑动是首次就加载数据数据
				 * =  否则不加载，只会对上拉和下拉加载数据 
				 * ========================================
				 * =  当是第一次左右滑动就判断是否为true
				 * =  然后加载数据,并赋值false
				 * =  再次滑过来的时候，如果是false就不重复加载数据
				 * =============================================
				*/
				//
				// {
				// 	onReady:true
				// }
			],
			bannerImage:[],//轮播图
			cainizaizhuiImage:[]//猜你在追
		}
	},
	onLoad() {
		// let xtSettingValue = uni.getStorageSync('xtsetting')
		// let CatJieko = uni.getStorageSync('cat_jieko')
		// console.log("CatJieko")
		// console.log(CatJieko)
		// let bannerImg = uni.getStorageSync('banner')
		// let cnzzImage = uni.getStorageSync('cainizaizhuiImage')
		// //非首次打开APP，先使用本地数据再静默更新新数据
		this.init()
		this.getbannerImage()
		this.getcainizaizhuiImage()
		
		console.log("获取接口类型数据")
		console.log(this.AppPlayerApi)
	},
	onShow: function() {
		//获取当前所有本地缓存的信息
		// uni.getStorageInfo({
		//     success: function (res) {
		//         console.log(res.keys);
		//         console.log(res.currentSize);
		//         console.log(res.limitSize);
		//     }
		// })
	},
	onReady() {
		
	},
	methods:{
		/* ====================================================
		 * =  异步变同步，因为异步不等好没好就执行下一个         =
		 * =  这样会造成“Setting”和“catJieko”谁先请求完是       =
		 * =  不能确定的，并且假设catJieko先请求完毕，那系       =
		 * =  统设置还没好，就执行了请求数据，这样是不对的。      =
		 * =  因为此时接口地址是空的。如果Setting好了，catJieko  =
		 * =  没有好，执行了请求数据也是请求不到的，因为没有分类id =
		 * =====================================================
		 */
		async init() {
			// 系统设置，含接口url
			await this.getxtSetting()
			// 分类设置 含分类id,如电视剧id2,....
			await this.getCatJieko()
			// 首次获取视频数据
			await this.onloadVideolist()
		},
		
		// 动态设置TabBar
		// setTab () {
		// 	uni.setTabBarStyle({
		// 	   color: '#afb7c4', //tab 上的文字默认颜色
		// 	   selectedColor: '#1b9df6', //tab 上的文字选中时的颜色
		// 	   backgroundColor: '#FFFFFF', //tab 的背景色，HexColor
		// 	   borderStyle: 'white' //tabBar上边框的颜色， 仅支持 black/white
		// 	})
		// },
		// Header头部点击事件（搜索||下载）
		changeHeader(e) {
			let TapUrl = e
			console.log("跳转页面")
			console.log(TapUrl)
			if (TapUrl == '') {
				uni.showToast({
					title:'暂未开放',
					icon:'none'
				})
			}else {
				uni.navigateTo({
					url:TapUrl
				})
			}
			
		},
		// tabs坐标
		changeTabs(i) {
			// tbasNav
			this.curIndex = i
			let curidx = i
			//获取视频数据(如果已经获取过了就不获取，除非是下拉和上拉)
			//this.onloadVideolist() //已移步至拦截器
			
			this.IsonReadychangeTabs(curidx)
		},
		// tabsSwiper坐标
		changeTabsSwiper(e){
			//console.log(e)
			// tabsSwiper
			this.curIndex = e.detail.current
			let curidx = e.detail.current
			//获取视频数据(如果已经获取过了就不获取，除非是下拉和上拉)
			//this.onloadVideolist() //已移步至拦截器
			
			this.IsonReadychangeTabs(curidx)
		},
		
		/* ===============================
		 * =  判断当前分类是否为为初次渲染  =
		 * =  如果是则放行，如果不是则拦截  =
		 * ===============================
		 */
		IsonReadychangeTabs(curidx) {
			let isonReady = this.Videolist_onReady[curidx].onReady
			console.log(isonReady)
			if (isonReady == true) {
				console.log("当前分类视频数据为初次渲染，拦截器放行")
				//获取视频数据(如果已经获取过了就不获取，除非是下拉和上拉)
				this.onloadVideolist()
			} else {
				console.log("当前分类视频数据非初次渲染，拦截")
			}
		},
		
		
		
		
		
		
		
		// #ifdef H5 || MP
		scroll:function(e) {
			//console.log(e)
		},
		upper: function(e) {
			//console.log(e)
			console.log("滚动到顶部")
		},
		lower: function(e) {
			//console.log(e)
			console.log("滚动到底部")
			console.log("上拉刷新")
			//this.getList()
			this.getLoadMore()
		},
		// #endif
		
		// #ifdef APP-NVUE
		loadMore(e){
			//console.log(e)
			uni.showToast({
				title:"上拉加载",
				icon:"none"
			})
			//this.getList()
			this.getLoadMore()
			
		},
		// #endif
		
		
		/* =================================================
		 * =  统一的“上拉加载”执行前获取的对应数据方法        =
		 * =  为什么要单独封装？                            =
		 * =  因为NVUE原生和非原生的上拉和下拉方法是不一样的  =
		 * ================================================
		 */
		getLoadMore(){
			//(1)获取分类的当前坐标
			let curidx = this.curIndex
			//(2)修改当前分类下的视频页码+1，因为用户上拉了
			this.Videolist_pg[curidx].pg = Number(this.Videolist_pg[curidx].pg) + Number(1)
			//(3)执行统一获取视频数据的调用方法
			this.onloadVideolist()
		},
		
		
		
		
		// 模拟请求数据
		// getList() {
		// 	let list = ['1','2','3','4','5','6','7','8','9','10',]
		// 	this.tabslist = this.tabslist.concat(list)
		// },
		
		
		
		
		/* =================================
		 * =  获取 客户端管理>软件设置 数据  =
		 * =================================
		 */
		async getxtSetting(){
			let event = {
				functions:'getxtSetting'
			}
			await this.admin({
				type:'xtsetting_get'
			})
			.then(res => {
				console.log(res)
				this.xtsetting = res
				console.log("系统设置")
				console.log(this.xtsetting)
				if (res == null) {
					this.errUniShowModal(event)
				}
			})
			.catch(err => {
				console.log("err")
				console.log(err)
				this.errUniShowModal(event)
			})
		},
		/* =================================
		 * =  获取 影视分类>>一级分类 数据  =
		 * =================================
		 */
		async getCatJieko(){
			let event = {
				functions:'getCatJieko'
			}
			this.Videolist_pg = []
			let tabslistVideolistS = this.tabslistVideolist//curindex对应的视频数据
			let Videolist_pgS = this.Videolist_pg//curindex对应的视频页码
			let Videolist_onReadyS = this.Videolist_onReady//curindex对应的视频是否为初次加载
			await this.admin({
				type:'cat_jieko_get'
			})
			.then(res => {
				
				console.log("一级分类")
				console.log(res)
				this.tabslist = []
				this.tabslist = this.tabslist.concat(res)
				console.log("tabslist")
				console.log(this.tabslist)
				
				
				for (let i=0; i<res.length; i++){
					// 分类有多少就插入多少
					// 插入分类对应的videolist数据数组
					tabslistVideolistS.push({"videolist":[]})
					// 插入分类对应的用到的当前分类的当前页码
					Videolist_pgS.push({"pg":1})
					// 插入分类对应的用到的 是否为首次加载
					Videolist_onReadyS.push({"onReady":true})
				}
				
				console.log("输出写入分类对应的videolist数据数组")
				console.log(this.tabslistVideolist)
				console.log("输出写入分类对应的用到的当前分类的当前页码")
				console.log(this.Videolist_pg)
				console.log("输出写入分类对应的用到的 是否为首次加载")
				console.log(this.Videolist_onReady)
				if (res == null) {
					this.errUniShowModal(event)
				} 
			})
			.catch(err => {
				console.log(err)
				this.errUniShowModal(event)
			})
		},
		
		
		/* =================================
		 * =  获取 客户端管理>轮播图 数据  =
		 * =================================
		 */
		getbannerImage(){
			let event = {
				functions:'getbannerImage'
			}
			this.admin({
				type:'banner_get'
			})
			.then(res => {
				console.log(res)
				this.bannerImage = res
				console.log("banner--轮播图")
				console.log(this.bannerImage)
				if (res == null) {
					this.errUniShowModal(event)
				}
			})
			.catch(err => {
				console.log("err")
				console.log(err)
				this.errUniShowModal(event)
			})
		},
		/* =================================
		 * =  获取 客户端管理>猜你在追 数据  =
		 * =================================
		 */
		getcainizaizhuiImage(){
			let event = {
				functions:'getcainizaizhuiImage'
			}
			this.admin({
				type:'cainizaizhuiImage_get'
			})
			.then(res => {
				console.log(res)
				this.cainizaizhuiImage = res
				console.log("cainizaizhuiImage--猜你在追")
				console.log(this.cainizaizhuiImage)
				if (res == null) {
					this.errUniShowModal(event)
				}
			})
			.catch(err => {
				console.log("err")
				console.log(err)
				this.errUniShowModal(event)
			})
		},
		
		
		
		/* =======================================
		 * 获取视频说明，为什么会封装成两个方法？
		 * (1方法)
		 * 1.是用来this.data数据：如index坐标(分类坐标)，和当前分类视频页码等
		 * 2.然后再调用(2)方法，把参数给(2)方法去获取数据再打印到页面上就行了。
		 * (2方法)
		 * 1.统一的视频请求走此方法
		 * (3方法)
		 * 1.统一的请求失败后是否重试走此方法
		 * =======================================
		 */
		
		
		/* =================================
		 * =  (1)统一获取视频数据的调用方法  =
		 * =================================
		 */
		onloadVideolist(){
			//请求视频数据
			//获取接口附加链接
			let apivod = this.AppPlayerApi.apivod
			//获取接口返回类型
			let ac_videolist = this.AppPlayerApi.ac_videolist
			
			//获取接口地址
			let APIjiekoUrl = this.xtsetting.APIjiekoUrl
			//获取当前坐标
			let curidx = this.curIndex
			//获取当前分类
			let t = this.tabslist[curidx].cat_id
			//设置当前页码为1，因为是第一次进入
			let pg = this.Videolist_pg[curidx].pg
			console.log("pg = " + pg)
			
			//定义统一数据
			const options = {
				apivod,//接口附加链接
				ac_videolist,//接口返回类型
				APIjiekoUrl,//接口url
				curidx,//坐标
				t, //分类
				pg //页码
			}
			
			//旧版测试
			//this.getVideolist(api,APIjiekoUrl,curidx,t,pg)
			//新版
			this.getVideolist(options)
		},
		/* ==============================
		 * =  (2)统一获取视频数据的调用接口  =
		 * ==============================
		 */
		getVideolist(options){
			this.request({
				type:'video',//判断请求类型
				url:options.APIjiekoUrl+options.apivod,
				data:{
					ac:options.ac_videolist,//模式
					t:options.t,//分类类型(苹果cms旧版)
					//type_id:t,//分类类型(苹果cms新版)
					pg:options.pg//页码
				}
			})
			.then(res=> {
				console.log("res")
				console.log(res.data.list)
				
				/* =========================================
				 * =  由于NVUE list>cell不支持row水平布局
				 * =  只支持竖向布局，因此这里把数组按照
				 * =  每3个合并成一个新的数组，页面上cell
				 * =  还是渲染item,只不过此时的item已经是
				 * =  3个数组的形式，然后组件里接受item再
				 * =  去循环，就可以实现一排3个视频展示，并
				 * =  且一排还是只用了一个cell。
				 * =========================================
				 */
				//js将每3个数组放到一个新的数组里面
				var data = res.data.list
				var result = []
				for(var i=0;i<data.length;i+=3){
				    result.push(data.slice(i,i+3));
				}
				console.log("result --- 396")
				console.log(result)
				
				
				//写入当前分类下的视频数据
				this.tabslistVideolist[options.curidx].videolist = this.tabslistVideolist[options.curidx].videolist.concat(result)
				
				/* =============================================
				 * =  写入当前分类下是否为初次渲染onReady = false
				 * =  避免重复的左右滑动，总是重复加载数据
				 * =  只要加载过数据的分类，只有上拉和下拉可以加载数据
				 * =============================================
				 */
				this.Videolist_onReady[options.curidx].onReady = false
				
			})
			.catch(err=>{
				console.log("err")
				console.log(err)
				uni.showModal({
					title:"数据请求失败",
					content:"是否重试？",
					success: (res) => {
						if(res.confirm){
							//用户点击确认
							//console.log("用户点击确认")
							this.getVideolist(options)
						}else{
							//用户点击取消
							//console.log("用户点击取消")
						}
					}
				})
			})
		},
		/* =================================
		 * =  (3)统一封装，数据请求失败的modal  =
		 * =================================
		 * @ title = "标题"
		 * @ content = "内容"
		 * @ showCancel = "是否显示取消按钮"
		 * @ functions = "执行方法"
		 */
		errUniShowModal(event){
			uni.showModal({
				title: event.title || '数据请求失败',
				content: event.content || '是否重试？',
				showCancel: event.showCancel || false,
				success: (res) => {
					if (res.confirm) {
						if (event.functions == 'getxtSetting') {
							this.getxtSetting()
						} else if (event.functions == 'getCatJieko') {
							this.getCatJieko()
						} else if (event.functions == 'getbannerImage') {
							this.getbannerImage()
						} else if (event.functions == 'getcainizaizhuiImage') {
							this.getcainizaizhuiImage()
						}
					}else {
						uni.showToast({
							title:"用户取消",
							icon:"none"
						})
					}
				}
			})
		},
		
	}
}